<%--
  Created by IntelliJ IDEA.
  User: gsb
  Date: 2019/11/22
  Time: 17:39
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>试题管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/lib/layui/css/layui.css">
    <link rel="stylesheet" href="/css/attend/m/common.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/eleTree.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css">
    <link rel="stylesheet" href="/lib/zTree_v3/css/zTreeStyle/zTreeStyle.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/eleTree.css">
    <script type="text/javascript" src="/js/jquery/jquery-1.9.1.js"></script>
    <script src="/lib/layui/layui/layui.js"></script>
    <script src="/lib/jquery.form.min.js"></script>
    <script src="/lib/layui/layui/js/common.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/layui/layui/js/baseCode/base.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js"></script>
    <script src="/js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <style>
        .layui-form-label{width:100px;}
        .layui-input-block{margin-left:130px;}
        .layui-disabled, .layui-disabled:hover{color: #797979 !important;}
    </style>
    <link rel="stylesheet" href="/lib/zTree_v3/css/zTreeStyle/zTreeStyle.css"/>
    <script type="text/javascript" src="/lib/zTree_v3/js/jquery.ztree.all.min.js"></script>
<%--    <link rel="stylesheet" href="/duplopages/manage/standard/form/css/treeselect.css"/>--%>
    <script type="text/javascript" src="/lib/layui/layui/lay/dest/layui.all.js"></script>
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js/"></script>
    <script src="/lib/layui/layui/js/baseCode/base.js?v=2019080918:09" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="layui-fluid" id="LAY-app-message">
    <input type="hidden" id="sortId">
    <div class="layui-row layui-col-space15">
        <div class="layui-lf" style="width:250px;float:left">
            <div class="layui-card">
                <div class="layui-card-body" id="leftHeight" style="height:650px;">
                    <ul id="questionTree" class="ztree" lay-filter="ztree" style="overflow:auto;height:100%"></ul>

                </div>
            </div>
        </div>
        <div class="layui-rt" style="width:calc(100% - 285px);float:left">
            <div class="layui-card">
                <style>
                    .layui-card-header .layui-icon{
                        top:auto !important;
                    }
                </style>
                <div id="queryarea_searchView"></div>


                <div class="layui-card-body">
                    <form class="layui-form" action="">
                        <div class="layui-form-item">
                            <div class="layui-inline" style="width:320px">
                                <label class="layui-form-label" style="width:80px;">试题类型</label>
                                <div class="layui-input-inline" style="width: 150px;">
                                    <select name="" class="stType" lay-verify="required">
                                        <option value="">请选择</option>
                                        <option value="1">单选题</option>
                                        <option value="2">多选题</option>
                                        <option value="3">判断题</option>
                                        <option value="4">填空题</option>
                                        <option value="5">问答题</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-inline" style="">
                                <label class="layui-form-label" style="width:80px;">难度类型</label>
                                <div class="layui-input-inline" style="width: 150px;">
                                    <select name="" class="ndType" lay-verify="required">
                                        <option value="">请选择</option>
                                        <option value="1">简单</option>
                                        <option value="2">中等</option>
                                        <option value="3">困难</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline" style="width:320px">
                                <label class="layui-form-label" style="width:80px;">创建人</label>
                                <div class="layui-input-inline" style="width: 150px;position: relative">
                                    <input type="text" name="price_min" placeholder="请输入创建人" autocomplete="off" id="user" class="layui-input user">
                                    <div style="position: absolute;right:-70px;top:7px; ">
                                        <a href="javascript:;" style="color: #207BD6;" id="addUser">添加</a>
                                        <a href="javascript:;" style="color: #207BD6;" id="clear">清除</a>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-inline" style="">
                                <label class="layui-form-label" style="width:80px;">题干</label>
                                <div class="layui-input-inline" style="width: 150px;">
                                    <input type="text" name="" placeholder="请输入题干" autocomplete="off" class="layui-input tigan">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <button type="button" class="layui-btn search">搜索</button>
                                <button type="button" class="layui-btn layui-btn-primary reset">全部重置</button>
                            </div>

                        </div>
                    </form>
                    <div id="action_actionView"></div>
                    <table id="questionTable" lay-filter="questionTable-table"></table>
                </div>
            </div>
        </div>
    </div>
    <script id="toolbar" type="text/html" lay-filter="btn">
        <button type="button" class="layui-btn layui-btn-primary layui-btn-sm add" id="add" lay-event="add">新建</button>
        <button type="button" class="layui-btn layui-btn-primary layui-btn-sm del" id="del"  lay-event="del">删除</button>
        <button type="button" class="layui-btn layui-btn-primary layui-btn-sm import" id="import" lay-event="import">导入</button>
    </script>
    <script id="barOperation" type="text/html" lay-filter="toolBtn">
        <button type="button" class="layui-btn  layui-btn-xs"  lay-event="preview">预览</button>
        <button type="button" class="layui-btn  layui-btn-xs"  lay-event="edit">编辑</button>
        <button type="button" class="layui-btn  layui-btn-xs layui-btn-danger "  lay-event="del">删除</button>
    </script>
</div>
</body>
</html>
<script>
    var height = $(window).height()
    $('#leftHeight').height(height-30)
    var type = $.GetRequest().type;
    var dataType = $.GetRequest().dataType;
    var shitiType=''
    if(dataType!=''&&dataType!=undefined){
        shitiType = dataType
    }else{
        shitiType = ''
    }
    var testArr=[];
    function removeWithoutCopy(arr, item) {
        for(var i = 0; i < arr.length; i++){
            if(arr[i].eqId == item ){
                arr.splice(i,1);
            }
        }
        return arr;
    }
    $(document).on("click", '#addUser',function () {
        user_id = 'user';
        $.popWindow("../../common/selectUser?0");
    });
    $(document).on("click", '#clear',function () {
        $('#user').attr('user_id', '');
        $('#user').attr('userprivname', '');
        $('#user').removeAttr('dataid');
        $('#user').val('');
    });
    layui.use(['table','layer','laydate','form','element','eleTree'], function(){
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var laydate = layui.laydate;
        var eleTree = layui.eleTree;
        var element = layui.element;
        if(shitiType!=''){
            var text = $('.stType option[value="'+shitiType+'"]').text();
            var optionStr = '<option value="">请选择</option><option value="'+shitiType+'">'+text+'</option>'
            $('.stType').html(optionStr)
        }
        form.render();


    //    获取左侧树
        // 初始化渲染 树形菜单
        var el = eleTree.render({
            elem: '#questionTree',
            showLine:true,
            url:'/tbExamList/showParent',
            lazy: true,
            load: function(data,callback) {
                $.post(' /tbExamList/showChild?sortId='+data.sortId,function (res) {
                    callback(res.data);//点击节点回调
                })
            },
            done:function (data) { //渲染完成回调
                aldata = data.data
            }
            ,highlightCurrent: true,
        });
        // 节点点击事件
        eleTree.on("nodeClick(ztree)",function(d) {
            var obj = d.data.currentData
            parentId=obj.sortId;
            $('#sortId').val(parentId)

            var currentPage = 1
            table.reload('questionTable',{
                url : '/exaQuestions/selectQuestion?sortId='+parentId,
                data:{page:currentPage},
                page:{
                    curr:currentPage
                }
                ,where:{
                    eqStatus:shitiType
                }
            })
        });

    //    获取右侧列表
        var tableObj=table.render({
            elem: '#questionTable'
            ,url: '/exaQuestions/selectQuestion' //数据接口
            ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['prev', 'page', 'next',  'skip','count','limit',]//自定义分页布局
                ,limits:[5,10,15,20,25,30,35,40,45,50]
                ,limit:5
                ,first: false //不显示首页
                ,last: false //不显示尾页
            } //开启分页
            ,where:{
                eqStatus:shitiType
            }
            ,toolbar:'#toolbar'
            ,cols: [[ //表头
                {type: 'checkbox' }
                ,{type: 'eqSubject', title: '题干',width:300,templet:function(d){
                   return d.eqSubject
                    }}
                ,{field: 'createName', title: '创建人'}
                ,{field: 'eqStatus', title: '类型',templet:function(d){
                        if(d.eqStatus == 1){
                            return '单选题'
                        }else if(d.eqStatus == 2){
                            return '多选题'
                        }else if(d.eqStatus == 3){
                            return '判断题'
                        }else if(d.eqStatus == 4){
                            return '填空题'
                        }else if(d.eqStatus == 5){
                            return '问答题'
                        }
                    }}
                ,{field: 'eqType', title: '难度类型',templet:function(d){
                        if(d.eqType == 1){
                            return '简单'
                        }else if(d.eqType == 2){
                            return '中等'
                        }else if(d.eqType == 3){
                            return '困难'
                        }
                    }}
                ,{fixed: 'right',width:200,fixed:'right', title: '操作',align:'center', toolbar: '#barOperation'}
            ]]
            ,limit:10
            ,done:function(res) {
                if(type == 'addTest'){
                    $('tbody button[lay-event="edit"]').hide()
                    $('tbody button[lay-event="del"]').hide()
                    $('#add').hide()
                    $('#del').hide()
                    $('#import').hide()
                }
                if(testArr.length>0){
                    for(var j=0;j<res.data.length;j++){
                        for(var i=0;i<testArr.length;i++){
                            if(res.data[j].eqId == testArr[i].eqId){
                                $('div[lay-id="questionTable"] .layui-table tr[data-index="'+j+'"]').find('input[type="checkbox"]').prop("checked", 'checked');
                            }
                        }
                    }
                    form.render('checkbox');
                }
            }
        });

        //搜索
        $('.search').click(function(){
            var  currentPage=1;
            var userid=''
            if($('#user').attr('dataid')!=''&&$('#user').attr('dataid')!=undefined){
                userid = $('#user').attr('dataid').replace(',','')
            }
            table.reload('questionTable',{
                url : '/exaQuestions/selectQuestion',
                data:{page:currentPage},
                page:{
                    curr:currentPage
                },
                where:{
                    sortId:$('#sortId').val(),
                    eqSubject:$('.tigan').val(),
                    eqType:$('.ndType').val(),
                    eqStatus:$('.stType').val(),
                    createId:userid
                }
            })
        })
        //重置
        $('.reset').click(function(){
            window.location.reload();
        })

        //监听工具条
        table.on('toolbar(questionTable-table)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）

            if(layEvent === 'add'){ //新建
                create(0,$('#sortId').val(),'')
            } else if(layEvent === 'del'){ //删除
                var data = table.checkStatus('questionTable').data;
                if(data.length>0){
                    var ids=''
                    for(var i=0;i<data.length;i++){
                        ids+= data[i].eqId+','
                    }
                    publicDeletes("/exaQuestions/deleteQuestion",ids,tableObj,table);
                }else{
                    layer.msg('未选中行',{icon:6})
                }

            } else if(layEvent === 'import'){ //导入
                var sortId = $('#sortId').val();
                layer.open({
                    type: 1,
                    title: '导入',
                    shadeClose: true,
                    shade: 0.5,
                    maxmin: true, //开启最大化最小化按钮
                    area: ['403px', '300px'],
                    btn:['确定','取消'],
                    content:'<form id="ajaxform" method="post" class="layui-form" action="/exaQuestions/importQuestion"  enctype="multipart/form-data">\n' +
                                ' <div class="layui-form-item">\n' +
                                '    <label class="layui-form-label">下载导入模板:</label>\n' +
                                '    <div class="layui-input-block" style="line-height: 38px;">\n' +
                                '       <a href="javascript:;" id="download" style="color: #1E9FFF">试题导入模板下载</a>\n' +
                                '    </div>\n' +
                            '  </div>'+
                            ' <div class="layui-form-item">\n' +
                            '    <label class="layui-form-label">选择导入文件:</label>\n' +
                            '    <div class="layui-input-block" style="line-height: 38px;">\n' +
                            '       <input type="file" name="file" value="请选择文件"/>\n' +
                            '    </div>\n' +
                            '  </div>'+
                        '    </form>',
                    success:function(){
                        form.render();
                        $('#download').click(function(){
                            window.location.href=encodeURI('/file/jdProject/试题导入模板.xls')
                        })
                    },
                    yes:function(index){
                        if ($('input[name="file"]').val() == "") {
                            layer.msg("请选择要导入的文件！", {icon: 2});
                            return false;
                        }
                        $('#ajaxform').ajaxSubmit({
                            dataType: 'json',
                            success:function (res) {
                                if(res.code==0){
                                   layer.msg('导入成功',{icon:1});
                                }else {
                                    layer.msg('导入失败',{icon:2});
                                }
                                layer.close(index)
                            }
                        })
                    }
                });

            }
        });
        //监听复选框的操作
        table.on('checkbox(questionTable-table)', function(obj){
            var data = obj.data
            if(obj.checked==true){
                if(obj.type=='one'){
                    testArr.push(data)
                }else{
                    var datas = table.checkStatus('questionTable').data;
                    for(var i=0;i<datas.length;i++){
                        testArr.push(datas[i])
                    }
                }
            }else{
                if(obj.type=='one'){
                    for(var i=0;i<testArr.length;i++){
                        if(testArr[i].eqId==obj.data.eqId){
                            removeWithoutCopy(testArr,obj.data.eqId)
                        }
                    }
                }else{
                    var datas = table.cache.questionTable;
                    for(var i=0;i<testArr.length;i++){
                        for(var j=0;j<datas.length;j++){
                            if(testArr[i].eqId==datas[j].eqId){
                                removeWithoutCopy(testArr,datas[j].eqId)
                            }
                        }
                    }
                }
            }
        });

        //监听操作工具条
        table.on('tool(questionTable-table)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
            if(layEvent === 'preview'){ //预览
                var eqId = data.eqId;
                layer.open({
                    type: 2,
                    title: '预览',
                    shadeClose: true,
                    shade: 0.5,
                    maxmin: true, //开启最大化最小化按钮
                    area: ['893px', '90%'],
                    content:'/tbExamList/preview?id='+eqId,
                });
            } else if(layEvent === 'del'){ //删除
                var eqId = data.eqId;
                publicDeletes("/exaQuestions/deleteQuestion",eqId,tableObj,table);
            } else if(layEvent === 'edit'){ //编辑
                var eqId = data.eqId;
                create(1,$('#sortId').val(),eqId)
            }
        });

    //    新建编辑共有函数
        function create(type,sortId,id){
            if(type=='0'){
                var title = '新建'
            }else{
                var title = '编辑'
            }
            layer.open({
                type: 2,
                title: title,
                shadeClose: true,
                shade: 0.5,
                maxmin: true, //开启最大化最小化按钮
                area: ['893px', '90%'],
                content:'/tbExamList/create?type='+type+'&sortId='+sortId+'&id='+id,
                end:function(){

                },
                cancel:function(index){

                }
            });
        }

        //        删除
        function publicDeletes(url,ids,tableIns,table){
            layer.confirm('确定要删除吗?', {icon: 3, title:'提示'}, function(index){
                var data={
                    ids:ids
                }
                var res=toAjaxT(url,data);
                layer.msg(res.msg)
                if(res.code==0){
                    try {
                        if (ids.substring(ids.length - 1) == ",") {
                            ids = ids.substring(0, ids.length - 1);
                        }
                        var dataSize = ids.split(",");
                        var dataAll = table.cache[tableIns.config.id];
                        if (dataAll.length == dataSize.length) {
                            //得到当前页
                            var page = $(".layui-laypage-skip .layui-input").val();

                            if (page > 1) {
                                tableIns.reload({
                                    page: {
                                        curr: page - 1 //重新从第 1 页开始
                                    }}
                                );
                            }else{
                                tableIns=tableIns.reload();
                            }
                        } else {
                            tableIns=tableIns.reload();
                        }
                    } catch (e) {
                        tableIns.reload();
                    }
                }
                layer.close(index);
            });
        }
    })
</script>